<template>
  <div style="display: flex">
    <Card
      style="width: 250px"
      dis-hover
      title="商品目录分类"
      icon="md-document"
    >
      <Row type="flex" justify="space-between" v-show="showCategory">
        <!-- <Button type="primary" @click="clickChildCategory">添加子分类</Button> -->
        <Button type="primary" @click="clickRootCategory">添加根分类</Button>
      </Row>
      <Row style="margin-top: 20px">
        <Tree
          :data="rootDate"
          :load-data="loadData"
          @on-select-change="treeSelectChange"
        />
      </Row>
    </Card>
    <Card
      title="填写分类信息明细"
      dis-hover
      icon="md-document"
      v-show="showRight"
      style="flex: 1"
    >
      <Form
        ref="FormData"
        :model="FormData"
        :rules="FormRules"
        :label-width="140"
      >
        <Row>
          <Col span="18" offset="3">
            <FormItem label="分类名称：" prop="categoryName">
              <Input
                v-model="FormData.categoryName"
                maxlength="20"
                show-word-limit
                placeholder="请输入分类名称"
              ></Input>
            </FormItem>
          </Col>
          <Col span="18" offset="3">
            <FormItem label="分类编码：" prop="categoryNo">
              <Input
                v-model="FormData.categoryNo"
                maxlength="15"
                show-word-limit
                placeholder="分类编码"
              ></Input>
            </FormItem>
          </Col>
          <Col span="18" offset="3">
            <FormItem
              v-if="isOnelevelNum"
              label="分类类型 ："
              prop="categoryType"
            >
              <Select
                v-model="FormData.categoryType"
                filterable
                style="width: 200px"
              >
                <Option
                  v-for="item in TypeList"
                  :value="item.value"
                  :key="item.value"
                  >{{ item.label }}</Option
                >
              </Select>
            </FormItem>
          </Col>
          <Col span="18" offset="3">
            <FormItem label="位置：" prop="position">
              <InputNumber
                v-model="FormData.position"
                :precision="0"
                type="number"
                placeholder="位置"
                :max="999"
                :min="0"
              />
            </FormItem>
          </Col>
          <Col span="18" offset="3">
            <FormItem label="是否启用：" prop="state">
              <RadioGroup v-model="FormData.state">
                <Radio label="1">启用</Radio>
                <Radio label="2">不启用</Radio>
              </RadioGroup>
            </FormItem>
          </Col>
          <Col span="18" offset="3">
            <FormItem label="描述：">
              <Input
                type="textarea"
                :autosize="{ minRows: 2, maxRows: 5 }"
                maxlength="50"
                show-word-limit
                v-model="FormData.categoryNote"
                placeholder="请输入描述"
              ></Input>
            </FormItem>
          </Col>
          <Col v-show="multipledata" span="18" offset="3">
            <Row type="flex">
              <FormItem label="限制类商品：" prop="categoryProductType">
                <RadioGroup v-model="FormData.categoryProductType">
                  <Radio label="1">危险品</Radio>
                  <Radio label="2">管制刀具</Radio>
                  <Radio label="3">非限制</Radio>
                </RadioGroup>
              </FormItem>
              <FormItem label="危化品等级 ：">
                <Select
                  v-model="FormData.dangerousOrder"
                  filterable
                  style="width: 200px"
                >
                  <Option
                    v-for="item in HCSList"
                    :value="item.value"
                    :key="item.value"
                    >{{ item.label }}</Option
                  >
                </Select>
              </FormItem>
            </Row>
            <Row>
              <FormItem label="关联商品模板：" prop="productTemplateNames">
                <Row type="flex">
                  <div class="qw-kuang"></div>
                </Row>
                <Input
                  v-model="FormData.productTemplateNames"
                  readonly
                  search
                  enter-button="选择"
                  @on-search="handleLink('template')"
                  placeholder="请选择"
                />
              </FormItem>
            </Row>
            <Row>
              <FormItem label="关联品牌：" prop="brandNames">
                <Input
                  v-model="FormData.brandNames"
                  readonly
                  search
                  enter-button="选择"
                  @on-search="handleLink('brand')"
                  placeholder="请选择"
                />
              </FormItem>
            </Row>
            <Row>
              <FormItem label="关联验收事项：" prop="acceptItemNames">
                <Input
                  v-model="FormData.acceptItemNames"
                  readonly
                  search
                  enter-button="选择"
                  @on-search="handleLink('gather')"
                  placeholder="请选择"
                />
              </FormItem>
            </Row>
            <Row>
              <FormItem label="关联归类名称：" prop="classificationNames">
                <Input
                  v-model="FormData.classificationNames"
                  readonly
                  search
                  enter-button="选择"
                  @on-search="handleLink('category')"
                  placeholder="请选择"
                />
              </FormItem>
            </Row>
            <!-- <Row>
              <FormItem label="关联场景模版：" prop="productSceneCategoryNames">
                <Input
                  v-model="FormData.productSceneCategoryNames"
                  readonly
                  search
                  enter-button="选择"
                  @on-search="handleLink('scene')"
                  placeholder="请选择"
                />
              </FormItem>
            </Row> -->
            <Row>
              <FormItem label="是否价格敏感：" prop="isPriceSensitive">
                <RadioGroup v-model="FormData.isPriceSensitive">
                  <Radio label="1">是</Radio>
                  <Radio label="2">否</Radio>
                </RadioGroup>
              </FormItem>
            </Row>
            <Row>
              <FormItem label="是否金属制品：" prop="isMetal">
                <RadioGroup v-model="FormData.isMetal">
                  <Radio label="1">是</Radio>
                  <Radio label="2">否</Radio>
                </RadioGroup>
              </FormItem>
            </Row>
            <Row>
              <FormItem label="是否重点：" prop="isKey">
                <RadioGroup v-model="FormData.isKey">
                  <Radio label="1">是</Radio>
                  <Radio label="2">否</Radio>
                </RadioGroup>
              </FormItem>
            </Row>
            <Row>
              <FormItem label="商品资质类型：">
                <Button type="primary" @click="handleLink('qualiByCommodity')"
                  >设置</Button
                >
              </FormItem>
            </Row>
            <Row>
              <FormItem label="分类资质类型：">
                <Button type="primary" @click="handleLink('qualiByClassify')"
                  >设置</Button
                >
              </FormItem>
            </Row>
            <Row>
              <FormItem label="批量订货额：">
                <!-- <Input type="number" number v-model="FormData.batchOrderPrice" maxlength="9" placeholder="请输入额度" style="width: 150px;" /> -->
                <InputNumber
                  v-model="FormData.batchOrderPrice"
                  :active-change="false"
                  :precision="2"
                  type="number"
                  placeholder=""
                  :max="999999999"
                  :min="0"
                  style="width: 150px"
                />
                元
              </FormItem>
            </Row>
          </Col>
          <Col span="18" offset="3">
            <FormItem>
              <Button
                @click="handleReset('FormData')"
                style="margin-right: 20px"
                class="ivu-ml-8"
                >取消</Button
              >
              <Button :loading="sLoading" type="primary" @click="handleSubmit"
                >提交</Button
              >
            </FormItem>
          </Col>
        </Row>
      </Form>
    </Card>
    <!----------------------------关联商品模板---------------------------------->
    <Modal v-model="linkAttribute" width="1000" title="关联商品模板">
      <Card dis-hover>
        <Row type="flex" justify="start" align="bottom">
          <Col style="margin-right: 40px">
            <span style="margin-right: 10px">属性模板名称</span>
            <Input
              style="width: auto"
              v-model="name"
              placeholder="请输入属性模板名称"
            ></Input>
          </Col>
          <Col>
            <Button
              type="primary"
              style="margin-right: 10px"
              @click="linkAttributeBt('1')"
              >查询</Button
            >
            <Button @click="linkAttributeBt('0')">清空</Button>
          </Col>
        </Row>
      </Card>
      <Card dis-hover>
        <Row>
          <Table
            ref="selection"
            border
            :columns="linkAttributeDataCol"
            :data="linkAttributeData"
            @on-selection-change="linkAttributeFun"
          >
            <template slot-scope="{ row, index }" slot="action">
              <Button
                type="success"
                size="small"
                style="margin: 3px 0"
                @click="guanlian(row, index)"
                >关联</Button
              >
            </template>
          </Table>
        </Row>
      </Card>
      <div slot="footer"></div>
    </Modal>
    <!----------------------------关联品牌---------------------------------->
    <Modal
      v-model="linkBrand"
      width="1000"
      title="关联品牌"
      @on-ok=""
      @on-cancel=""
    >
      <Card dis-hover>
        <Row type="flex" justify="start" align="bottom">
          <Col style="margin-right: 40px">
            <span style="margin-right: 10px">品牌名称</span>
            <Input
              style="width: auto"
              v-model="brandName"
              placeholder="请输入品牌名称"
            ></Input>
          </Col>
          <Col style="margin-right: 40px">
            <span style="margin-right: 10px">品牌英文名称</span>
            <Input
              style="width: auto"
              v-model="brandEnName"
              placeholder="请输入品牌英文名称"
            ></Input>
          </Col>
          <Col>
            <Button
              type="primary"
              style="margin-right: 10px"
              @click="linkBrandBt('1')"
              >查询</Button
            >
            <Button @click="linkBrandBt('0')">清空</Button>
          </Col>
        </Row>
      </Card>
      <Card dis-hover>
        <Row>
          <Table
            ref="selection"
            border
            :columns="linkBrandDataCol"
            :data="linkBrandData"
            @on-selection-change="linkBrandFun"
          >
          </Table>
        </Row>
      </Card>
    </Modal>
    <!----------------------------关联验收事项---------------------------------->
    <Modal
      v-model="linkGather"
      width="1000"
      title="关联验收事项"
      @on-ok=""
      @on-cancel=""
    >
      <Card dis-hover>
        <Row type="flex" justify="start" align="bottom">
          <Col style="margin-right: 40px">
            <span style="margin-right: 10px">验收事项</span>
            <Input
              style="width: auto"
              v-model="itemName"
              placeholder="请输入验收事项"
            ></Input>
          </Col>
          <Col>
            <Button
              type="primary"
              style="margin-right: 10px"
              @click="linkGatherBt('1')"
              >查询</Button
            >
            <Button @click="linkGatherBt('0')">清空</Button>
          </Col>
        </Row>
      </Card>
      <Card dis-hover>
        <Row>
          <Table
            ref="selection"
            border
            :columns="linkGatherDataCol"
            :data="linkGatherData"
            @on-selection-change="linkGatherFun"
          >
            <template slot-scope="{ row, index }" slot="isNeedForPurchase">
              <RadioGroup v-model="row.isNeedForPurchase">
                <Radio label="1">是</Radio>
                <Radio label="2">否</Radio>
              </RadioGroup>
            </template>
            <template slot-scope="{ row, index }" slot="isNeed">
              <RadioGroup v-model="row.isNeed">
                <Radio label="1">是</Radio>
                <Radio label="2">否</Radio>
              </RadioGroup>
            </template>
          </Table>
        </Row>
      </Card>
    </Modal>
    <!----------------------------关联归类模板---------------------------------->
    <Modal
      v-model="linkCategory"
      width="1000"
      title="关联税类模板"
      @on-ok=""
      @on-cancel=""
    >
      <Card dis-hover>
        <Row type="flex" justify="start" align="bottom">
          <Col style="margin-right: 40px">
            <span style="margin-right: 10px">归类名称</span>
            <Input
              style="width: auto"
              v-model="classificationName"
              placeholder="请输入归类名称"
            ></Input>
          </Col>
          <Col style="margin-right: 40px">
            <span style="margin-right: 10px">税类名称</span>
            <Input
              style="width: auto"
              v-model="taxCateName"
              placeholder="请输入税类名称"
            ></Input>
          </Col>
          <Col style="margin-right: 40px">
            <span style="margin-right: 10px">税类编码</span>
            <Input
              style="width: auto"
              v-model="taxCateNo"
              placeholder="请输入税类编码"
            ></Input>
          </Col>
          <Col style="padding: 10px 0">
            <Button
              type="primary"
              style="margin-right: 10px"
              @click="linkCategoryBt('1')"
              >查询</Button
            >
            <Button @click="linkCategoryBt('0')">清空</Button>
          </Col>
        </Row>
      </Card>
      <Card dis-hover>
        <Row>
          <Row>
            <Table
              ref="selection"
              border
              :columns="linkCategoryDataCol"
              :data="linkCategoryData"
              @on-selection-change="linkCategoryFun"
            >
              <template slot-scope="{ row, index }" slot="state">
                <span v-if="row.state === '1'">未审核</span>
                <span v-if="row.state === '2'">通过</span>
                <span v-if="row.state === '3'">未通过</span>
              </template>
            </Table>
          </Row>
        </Row>
      </Card>
    </Modal>
    <!----------------------------关联场景分类开始---------------------------------->
    <Modal
      v-model="linkScene"
      width="1000"
      title="关联场景模板"
      @on-ok=""
      @on-cancel=""
    >
      <Card dis-hover>
        <Row type="flex" justify="start" align="bottom">
          <Col style="margin-right: 40px">
            <span style="margin-right: 10px">二级场景分类名称</span>
            <Input
              style="width: auto"
              v-model="categoryName"
              placeholder="请输入二级场景分类"
            ></Input>
          </Col>
          <Col style="margin-right: 40px">
            <span style="margin-right: 10px">一级场景分类名称</span>
            <Input
              style="width: auto"
              v-model="parentName"
              placeholder="请输入一级场景分类"
            ></Input>
          </Col>
          <Col>
            <Button
              type="primary"
              style="margin-right: 10px"
              @click="linkSceneBt('1')"
              >查询</Button
            >
            <Button @click="linkSceneBt('0')">清空</Button>
          </Col>
        </Row>
      </Card>
      <Card dis-hover>
        <Row>
          <Table
            ref="selection"
            border
            :columns="linkSceneDataCol"
            :data="linkSceneData"
            @on-selection-change="linkSceneFun"
          >
            <template slot-scope="{ row, index }" slot="categoryState">
              <span v-if="row.categoryState === '1'">启用</span>
              <span v-if="row.categoryState === '2'">未启用</span>
            </template>
          </Table>
        </Row>
      </Card>
    </Modal>
    <!----------------------------关联场景分类结束---------------------------------->
    <!----------------------------商品资质类型---------------------------------->
    <Modal
      v-model="qualiByCommodity"
      width="1000"
      title="商品资质类型"
      @on-ok=""
      @on-cancel=""
    >
      <Card dis-hover>
        <Row>
          <Table
            ref="selection"
            border
            :columns="qualiByCommodityCol"
            :data="qualiByCommodityData"
            @on-select="handleQualificationTablaeSelect($event, '1')"
            @on-select-all="handleSelectAll($event, '1')"
            @on-select-all-cancel="handleSelectAllCancel($event, '1')"
          >
            <template slot-scope="{ row, index }" slot="mustHave">
              <RadioGroup
                v-model="row.mustHave"
                @on-change="radioChange($event, index, '1')"
              >
                <Radio label="1">是</Radio>
                <Radio label="2">否</Radio>
              </RadioGroup>
            </template>
          </Table>
        </Row>
      </Card>
    </Modal>
    <!----------------------------分类资质类型---------------------------------->
    <Modal
      v-model="qualiByClassify"
      width="1000"
      title="分类资质类型"
      @on-ok=""
      @on-cancel=""
    >
      <Card dis-hover>
        <Row>
          <Table
            ref="selection"
            border
            :columns="qualiByCommodityCol"
            :data="qualiByClassifyData"
            @on-select="handleQualificationTablaeSelect($event, '2')"
            @on-select-all="handleSelectAll($event, '2')"
            @on-select-all-cancel="handleSelectAllCancel($event, '2')"
          >
            <template slot-scope="{ row, index }" slot="mustHave">
              <RadioGroup
                v-model="row.mustHave"
                @on-change="radioChange($event, index, '2')"
              >
                <Radio label="1">是</Radio>
                <Radio label="2">否</Radio>
              </RadioGroup>
            </template>
          </Table>
        </Row>
      </Card>
    </Modal>
  </div>
</template>
<script>
import { mapState, mapMutations } from 'vuex';
import util from '@/libs/util';
import bus from '@/mixins/bus';
import { ApiRequest } from '@api/basePage';

export default {
  components: {},
  data () {
    return {
      linkAttribute: false,
      linkBrand: false,
      linkGather: false,
      linkCategory: false,
      linkScene: false,
      qualiByCommodity: false,
      qualiByClassify: false,
      ceshi: true,
      totalNum: 0,
      nowPage: 1,
      name: '',
      brandName: '',
      brandEnName: '',
      itemName: '',
      classificationName: '',
      taxCateName: '',
      taxCateNo: '',
      categoryName: '',
      parentName: '',
      fatherName: '',
      listAcceptItems: [],
      linkAttributeDataCol: [
        // {
        // 	type: 'selection',
        // 	width: 60,
        // 	align: 'center'
        // },
        {
          title: '属性模板名称',
          key: 'name'
        },
        {
          title: '属性分类名称',
          key: 'categoryName'
        },
        {
          title: '模板描述',
          key: 'note'
        },
        {
          title: '操作',
          slot: 'action',
          align: 'center',
          minWidth: 120
        }
      ],
      linkBrandDataCol: [
        {
          type: 'selection',
          width: 60,
          align: 'center'
        },
        {
          title: '品牌名称',
          key: 'brandName'
        },
        {
          title: '品牌英文名称',
          key: 'brandEnName'
        },
        {
          title: '品牌描述',
          key: 'note'
        }
      ],
      linkGatherDataCol: [
        {
          type: 'selection',
          width: 60,
          align: 'center'
        },
        {
          title: '验收事项名称',
          key: 'itemName'
        },
        {
          title: '临采商品是否必填',
          slot: 'isNeedForPurchase'
        },
        {
          title: '非临采商品是否必填',
          slot: 'isNeed'
        }
      ],
      linkCategoryDataCol: [
        {
          type: 'selection',
          width: 60,
          align: 'center'
        },
        {
          title: '归类名称',
          key: 'classificationName'
        },
        {
          title: '税类名称',
          key: 'taxCateName'
        },
        {
          title: '税类编码',
          key: 'taxCateNo'
        },
        {
          title: '税率',
          key: 'taxRate'
        },
        {
          title: '审核状态',
          slot: 'state'
        },
        {
          title: '描述',
          key: 'note'
        }
      ],
      linkSceneDataCol: [
        {
          type: 'selection',
          width: 60,
          align: 'center'
        },
        {
          title: '二级场景分类名称',
          key: 'categoryName'
        },
        {
          title: '一级场景分类名称',
          key: 'parentName'
        },
        {
          title: '启用状态',
          slot: 'categoryState'
        },
        {
          title: '模板描述',
          key: 'categoryDesc'
        }
      ],
      qualiByCommodityCol: [
        {
          type: 'selection',
          width: 60,
          align: 'center'
        },
        {
          title: '资质类型',
          key: 'qualificationTypeName'
        },
        {
          title: '是否必填',
          slot: 'mustHave'
        }
      ],
      qualiByCommodityData: [],
      qualiByClassifyData: [],
      linkAttributeData: [],
      linkBrandData: [],
      linkGatherData: [],
      linkCategoryData: [],
      linkSceneData: [],
      multipledata: false,
      isRootCategory: true,
      showRight: false,
      showCategory: true,
      HCSList: [
        {
          value: '1',
          label: '一级'
        },
        {
          value: '2',
          label: '二级'
        },
        {
          value: '3',
          label: '三级'
        }
      ],
      TypeList: [
        {
          value: '1',
          label: '产品使用'
        },
        {
          value: '2',
          label: '供应商使用'
        },
        {
          value: '3',
          label: '产品/供应商共用'
        }
      ],
      util: util,
      dynamicData: {},
      pagePath: '', // 当前路由
      FormRules: {
        categoryName: [
          { required: true, message: '请填写分类名称', trigger: 'blur' },
          {
            type: 'string',
            min: 1,
            max: 20,
            message: '分类名称不得少于1个字符,且不能大于20个字符',
            trigger: 'blur'
          }
        ],
        categoryNo: [
          { required: true, message: '请填写分类编码', trigger: 'blur' },
          {
            type: 'string',
            min: 1,
            max: 15,
            message: '分类编码不得少于1个字符,且不能大于15个字符',
            trigger: 'blur'
          }
        ],
        categoryType: [
          { required: true, message: '请选择类型', trigger: 'blur' }
        ],
        position: [{ required: true, message: '位置不能为空' }],
        categoryNote: [
          { required: true, message: '请填写描述', trigger: 'blur' },
          {
            type: 'string',
            min: 1,
            max: 50,
            message: '描述不得少于一个字符,,且不能大于50个字符',
            trigger: 'blur'
          }
        ],
        state: [
          { required: true, message: '启用状态不能为空', trigger: 'blur' }
        ],
        categoryProductType: [
          { required: true, message: '限制类型', trigger: 'blur' }
        ],
        // dangerousOrder: [{ required: true, message: '危险品等级不能为空', trigger: 'blur' }],
        productTemplateNames: [
          { required: true, message: '关联商品模板不能为空', trigger: 'blur' }
        ],
        brandNames: [{ required: true, message: '关联品牌不能为空' }],
        acceptItemNames: [{ required: true, message: '关联验收事项不能为空' }],
        classificationNames: [
          { required: true, message: '关联归类事项不能为空' }
        ],
        /* productSceneCategoryNames: [
          { required: true, message: '关联场景模板不能为空' }
        ], */
        isPriceSensitive: [
          { required: true, message: '是否价格敏感不能为空', trigger: 'blur' }
        ],
        isMetal: [
          { required: true, message: '是否金属制品不能为空', trigger: 'blur' }
        ],
        isKey: [
          { required: true, message: '是否重点不能为空', trigger: 'blur' }
        ],
        batchOrderPrice: [
          { required: true, message: '请填写批量订货额', trigger: 'blur' }
        ]
      },
      isOnelevelNum: true,
      FormData: {
        parentUuid: 'systemUuid',
        categoryName: '',
        categoryNote: '',
        levelNum: '',
        categoryType: '1',
        position: 0,
        state: '1',
        uuid: '',
        categoryProductType: '3',
        dangerousOrder: '',
        isPriceSensitive: '1',
        isMetal: '1',
        isKey: '1',
        batchOrderPrice: 0,
        templateUuids: [],
        productTemplateNames: '',
        brandNames: '',
        brandUuids: [],
        acceptItemNames: '',
        acceptItemUuids: [],
        classificationUuids: [],
        classificationNames: '',
        productSceneCategoryUuids: [],
        productSceneCategoryNames: '',
        listQualificationTypes: [], // 该参数是给后台传递用的
        listQualificationTypes1: [] // 该参数是给后台传递用的
      },
      templateUuids: [],
      templateNames: [],
      brandUuids: [],
      brandNames: [],
      acceptItemNames: [],
      acceptItemUuids: [],
      classificationUuids: [],
      classificationNames: [],
      productSceneCategoryUuids: [],
      productSceneCategoryNames: [],
      rootDate: [],
      sLoading: false
    };
  },
  watch: {
    $route: function () {
      this.$nextTick(() => {
        this.$router.go(0);
      });
    }
  },
  created () {
    this.getConfigData();
    this.initData();
    this.clickRootCategory();
  },
  mounted () {},
  methods: {
    // 获取初始配置信息
    getConfigData () {
      this.pagePath = this.$route.path;
      let dynamicData = require('./configjs/categoryAdd').default;
      this.requestApi = dynamicData.requestApi; // 页面所需接口集合
      this.$set(this.$data, 'dynamicData', dynamicData);
    },
    // 初始化数的数据
    initData (formData) {
      let data = {
        parentUuid: 'systemUuid'
      };
      // 创建分类
      ApiRequest(
        this.requestApi.getPlatCategorySubByParentUuid.url,
        this.requestApi.getPlatCategorySubByParentUuid.type,
        data,
        true
      ).then(res => {
        if (res.retStatus === '1') {
          let myNewData = [];
          res.retData.forEach(item => {
            myNewData.push({
              title: item.categoryName,
              uuid: item.uuid,
              categoryType: item.categoryType,
              levelNum: item.levelNum,
              loading: false,
              children: []
            });
          });
          this.rootDate = myNewData;
        }
      });
    },
    // 获取表格数据
    getData (formData) {
      this.$refs.table.getData(formData);
    },
    // 点击 关联子分类
    clickChildCategory () {
      this.multipledata = false;
      this.isRootCategory = false;
      this.showRight = true;
      this.isOnelevelNum = false;
    },
    // 点击添加根分类
    clickRootCategory () {
      // this.multipledata = true;
      this.multipledata = false;
      this.isRootCategory = true;
      this.showRight = true;
      this.isOnelevelNum = true;
    },
    // 选择关联
    handleLink (e) {
      let link = e;
      if (link == 'template') {
        this.name = '';
        this.linkAttribute = true;
        this.linkAttributeInit();
      } else if (link == 'brand') {
        this.brandName = '';
        this.brandEnName = '';
        this.linkBrand = true;
        this.linkbrandInit();
      } else if (link == 'gather') {
        this.itemName = '';
        this.linkGather = true;
        this.linkGatherInit();
      } else if (link == 'category') {
        this.classificationName = '';
        this.taxCateName = '';
        this.taxCateNo = '';
        this.linkCategory = true;
        this.linkCategoryInit();
      } else if (link == 'scene') {
        this.categoryName = '';
        this.parentName = '';
        this.linkScene = true;
        this.linkSceneInit();
      } else if (link == 'qualiByCommodity') {
        this.qualiByCommodity = true;
        this.qualiByCommodityData = [];
        this.qualiByCommodityInit();
      } else if (link == 'qualiByClassify') {
        this.qualiByClassify = true;
        this.qualiByClassifyData = [];
        this.qualiByClassifyInit();
      }
    },
    qualiByCommodityInit () {
      let that = this;
      let data = {};
      // 商品资质类型
      ApiRequest(
        '/sysback/quatype/quaTypeProductList',
        'post',
        data,
        false
      ).then(res => {
        if (res.retStatus === '1') {
          res.retData.forEach(element => {
            that.qualiByCommodityData.push({
              relType: '1',
              qualificationTypeNo: element.quaTypeNo,
              qualificationTypeName: element.quaTypeName,
              mustHave: '2'
            });
          });
        }
      });
    },
    qualiByClassifyInit () {
      let that = this;
      let data = {};
      // 分类资质类型
      ApiRequest(
        '/sysback/quatype/quaTypeCategoryList',
        'post',
        data,
        false
      ).then(res => {
        if (res.retStatus === '1') {
          res.retData.forEach(element => {
            that.qualiByClassifyData.push({
              relType: '2',
              qualificationTypeNo: element.quaTypeNo,
              qualificationTypeName: element.quaTypeName,
              mustHave: '2'
            });
          });
        }
      });
    },
    linkAttributeInit () {
      let searchParam = [];
      searchParam.push({ name: 'name', value: this.name });
      searchParam.push({ name: 'name_q', value: 'Like' });
      let data = {
        nowPage: this.nowPage,
        pageShow: this.pageShow,
        searchParam: JSON.stringify(searchParam),
        sortName: '',
        sortType: ''
      };
      // 获取属性列表
      ApiRequest(
        '/sysback/template/producttemplate/baseQueryList',
        'post',
        data,
        false
      ).then(res => {
        if (res.retStatus === '1') {
          this.linkAttributeData = res.retData.results;
        }
      });
    },
    linkbrandInit () {
      let searchParam = [];
      searchParam.push({ name: 'brandName', value: this.brandName });
      searchParam.push({ name: 'brandName_q', value: 'Like' });
      searchParam.push({ name: 'brandEnName', value: this.brandEnName });
      searchParam.push({ name: 'brandEnName_q', value: 'Like' });
      let data = {
        nowPage: this.nowPage,
        pageShow: this.pageShow,
        searchParam: JSON.stringify(searchParam),
        sortName: '',
        sortType: ''
      };
      // 获取属性列表
      ApiRequest(
        '/sysback/productbrand/productbrand/baseQueryList',
        'post',
        data,
        false
      ).then(res => {
        if (res.retStatus === '1') {
          this.linkBrandData = res.retData.results;
        }
      });
    },
    linkGatherInit () {
      let searchParam = [];
      searchParam.push({ name: 'itemName', value: this.itemName });
      searchParam.push({ name: 'itemName_q', value: 'Like' });
      let data = {
        nowPage: this.nowPage,
        pageShow: this.pageShow,
        searchParam: JSON.stringify(searchParam),
        sortName: '',
        sortType: ''
      };
      // 获取属性列表
      ApiRequest(
        '/sysback/acceptitem/acceptitem/baseQueryList',
        'post',
        data,
        false
      ).then(res => {
        if (res.retStatus === '1') {
          // this.linkGatherData = res.retData.results;
          res.retData.results.forEach(element => {
            element.isNeedForPurchase = '1';
            element.isNeed = '1';
          });
          this.linkGatherData = res.retData.results;
        }
      });
    },
    linkCategoryInit () {
      let searchParam = [];
      searchParam.push({
        name: 'classificationName',
        value: this.classificationName
      });
      searchParam.push({ name: 'classificationName_q', value: 'Like' });
      searchParam.push({ name: 'taxCateName', value: this.taxCateName });
      searchParam.push({ name: 'taxCateName_q', value: 'Like' });
      searchParam.push({ name: 'taxCateNo', value: this.taxCateNo });
      searchParam.push({ name: 'taxCateNo_q', value: 'Like' });
      let data = {
        nowPage: this.nowPage,
        pageShow: this.pageShow,
        searchParam: JSON.stringify(searchParam),
        sortName: '',
        sortType: ''
      };
      // 获取属性列表
      ApiRequest(
        '/sysback/classification/baseQueryList',
        'post',
        data,
        false
      ).then(res => {
        if (res.retStatus === '1') {
          this.linkCategoryData = res.retData.results;
        }
      });
    },
    linkSceneInit () {
      let searchParam = [];
      searchParam.push({ name: 'categoryName', value: this.categoryName });
      searchParam.push({ name: 'categoryName_q', value: 'Like' });
      searchParam.push({ name: 'parentName', value: this.parentName });
      searchParam.push({ name: 'parentName_q', value: 'Like' });
      let data = {
        nowPage: this.nowPage,
        pageShow: this.pageShow,
        searchParam: JSON.stringify(searchParam),
        sortName: '',
        sortType: ''
      };
      // 获取属性列表
      ApiRequest(
        '/sysback/category/productscenecategory/baseQueryList',
        'post',
        data,
        false
      ).then(res => {
        if (res.retStatus === '1') {
          this.linkSceneData = res.retData.results;
        }
      });
    },

    guanlian (row, index) {
      this.$Modal.confirm({
        title: '关联模板',
        content: '确定要关联该模板吗？',
        onOk: () => {
          this.templateUuids = [];
          this.templateNames = [];
          this.templateUuids.push(row.uuid);
          this.templateNames.push(row.name);
          this.FormData.productTemplateNames = this.templateNames.join(',');
          this.FormData.templateUuids = this.templateUuids;
          this.$Message.success('关联成功!');
          this.linkAttribute = false;
        }
      });
    },
    // 关联属性选择
    linkAttributeFun (row) {
      this.templateUuids = [];
      this.templateNames = [];
      row.forEach(item => {
        this.templateUuids.push(item.uuid);
        this.templateNames.push(item.name);
      });
      this.FormData.productTemplateNames = this.templateNames.join(',');
      this.FormData.templateUuids = this.templateUuids;
    },
    // 关联品牌选择
    linkBrandFun (row) {
      this.brandUuids = [];
      this.brandNames = [];
      row.forEach(item => {
        this.brandUuids.push(item.uuid);
        this.brandNames.push(item.brandName);
      });
      this.FormData.brandNames = this.brandNames.join(',');
      this.FormData.brandUuids = this.brandUuids;
    },
    // 关联验收事项选择
    linkGatherFun (row) {
      this.acceptItemUuids = [];
      this.acceptItemNames = [];
      row.forEach(item => {
        this.acceptItemUuids.push(item.uuid);
        this.acceptItemNames.push(item.itemName);
      });
      this.FormData.acceptItemNames = this.acceptItemNames.join(',');
      this.FormData.acceptItemUuids = this.acceptItemUuids;
      this.listAcceptItems = row;
      this.listAcceptItems.forEach(element => {
        element.categoryUuid = this.FormData.uuid;
        element.acceptItemUuid = element.uuid;
      });
    },
    linkCategoryFun (row) {
      this.classificationUuids = [];
      this.classificationNames = [];
      row.forEach(item => {
        this.classificationUuids.push(item.uuid);
        this.classificationNames.push(item.classificationName);
      });
      this.FormData.classificationNames = this.classificationNames.join(',');
      this.FormData.classificationUuids = this.classificationUuids;
    },
    linkSceneFun (row) {
      this.productSceneCategoryUuids = [];
      this.productSceneCategoryNames = [];
      row.forEach(item => {
        this.productSceneCategoryUuids.push(item.uuid);
        this.productSceneCategoryNames.push(item.categoryName);
      });
      this.FormData.productSceneCategoryNames = this.productSceneCategoryNames.join(
        ','
      );
      this.FormData.productSceneCategoryUuids = this.productSceneCategoryUuids;
    },
    radioChange (data, index, type) {
      if (type === '1') {
        this.qualiByCommodityData[index].mustHave = data;
      } else {
        this.qualiByClassifyData[index].mustHave = data;
      }
    },
    handleQualificationTablaeSelect (data, type) {
      if (type === '1') {
        this.FormData.listQualificationTypes = data;
      } else {
        this.FormData.listQualificationTypes1 = data;
      }
    },
    handleSelectAll (row, type) {
      if (type === '1') {
        this.FormData.listQualificationTypes = row;
      } else {
        this.FormData.listQualificationTypes1 = row;
      }
    },
    handleSelectAllCancel (row, type) {
      if (type === '1') {
        this.FormData.listQualificationTypes = [];
      } else {
        this.FormData.listQualificationTypes1 = [];
      }
    },
    linkAttributeBt (type) {
      if (type === '0') {
        this.name = '';
      }
      this.linkAttributeInit();
    },
    linkBrandBt (type) {
      if (type === '0') {
        this.brandName = '';
        this.brandEnName = '';
      }
      this.linkbrandInit();
    },
    linkGatherBt (type) {
      if (type === '0') {
        this.itemName = '';
      }
      this.linkGatherInit();
    },
    linkCategoryBt (type) {
      if (type === '0') {
        this.classificationName = '';
        this.taxCateName = '';
        this.taxCateNo = '';
      }
      this.linkCategoryInit();
    },
    linkSceneBt (type) {
      if (type === '0') {
        this.categoryName = '';
        this.parentName = '';
      }
      this.linkSceneInit();
    },
    handleSubmit () {
      if (
        this.FormData.categoryName === '' ||
        this.FormData.categoryName === null ||
        this.FormData.categoryName === undefined
      ) {
        this.$Message.error('分类名称不能为空!');
        return;
      }
      if (
        this.FormData.categoryNo === '' ||
        this.FormData.categoryNo === null ||
        this.FormData.categoryNo === undefined
      ) {
        this.$Message.error('分类编码不能为空!');
        return;
      }
      if (
        this.FormData.position === '' ||
        this.FormData.position === null ||
        this.FormData.position === undefined
      ) {
        this.$Message.error('位置不能为空!');
        return;
      }
      // if (this.FormData.categoryNote === "" || this.FormData.categoryNote === null
      // 	|| this.FormData.categoryNote === undefined) {
      // 	this.$Message.error('描述不能为空!');
      // 	return;
      // }
      let title = '';
      let content = '';
      if (this.isRootCategory) {
        // 创建末级分类
        this.FormData.levelNum = '1';
        this.FormData.parentUuid = 'systemUuid';
        title = '添加根分类';
        content = '确定要添加根分类吗？';
      } else {
        if (this.multipledata) {
          if (this.FormData.categoryProductType !== '3') {
            if (
              this.FormData.dangerousOrder !== '1' &&
              this.FormData.dangerousOrder !== '2' &&
              this.FormData.dangerousOrder !== '3'
            ) {
              this.$Message.error('请完善危险品等级后再提交!');
              return;
            }
          }
          if (
            this.FormData.batchOrderPrice === '' ||
            this.FormData.batchOrderPrice === null ||
            this.FormData.batchOrderPrice === undefined
          ) {
            this.$Message.error('请完善批量订货额后再提交!');
            return;
          }
          if (
            this.FormData.productTemplateNames === '' ||
            this.FormData.productTemplateNames === null ||
            this.FormData.productTemplateNames === undefined
          ) {
            this.$Message.error('请完善商品模板后再提交!');
            return;
          }
          if (
            this.FormData.brandNames === '' ||
            this.FormData.brandNames === null ||
            this.FormData.brandNames === undefined
          ) {
            this.$Message.error('请关联品牌后再提交!');
            return;
          }
          if (
            this.FormData.acceptItemNames === '' ||
            this.FormData.acceptItemNames === null ||
            this.FormData.acceptItemNames === undefined
          ) {
            this.$Message.error('请完善验收事项后再提交!');
            return;
          }
          if (
            this.FormData.classificationNames === '' ||
            this.FormData.classificationNames === null ||
            this.FormData.classificationNames === undefined
          ) {
            this.$Message.error('请完善归类名称后再提交!');
            return;
          }
          /* if (
            this.FormData.productSceneCategoryNames === '' ||
            this.FormData.productSceneCategoryNames === null ||
            this.FormData.productSceneCategoryNames === undefined
          ) {
            this.$Message.error('请完善场景模板后再提交!');
            return;
          } */
        }
        this.FormData.parentUuid = this.FormData.uuid;
        title = '添加子分类';
        content = '确定要添加' + this.fatherName + '的子分类吗？';
      }
      this.FormData.listAcceptItems = this.listAcceptItems;
      this.FormData.listQualificationTypes1.forEach(element => {
        this.FormData.listQualificationTypes.push(element);
      });
      let data = this.FormData;
      this.$Modal.confirm({
        title: title,
        content: content,
        onOk: () => {
          this.sLoading = true;
          // 创建分类
          ApiRequest(
            this.requestApi.createPlatCategory.url,
            this.requestApi.createPlatCategory.type,
            data,
            false
          )
            .then(res => {
              if (res.retStatus === '1') {
                this.sLoading = false;
                this.$Message.success('添加成功');
                this.handleReset();
              }
            })
            .catch(() => {
              this.sLoading = false;
            });
        }
      });
    },
    handleReset () {
      this.$router.go(-1);
    },
    treeSelectChange (arr, item) {
      this.isOnelevelNum = false; // 如果存在点击事件,就认为已经不是在建立根分类了
      this.isRootCategory = false;
      this.FormData.uuid = item.uuid;
      if (arr[0].categoryType === null) {
        this.FormData.categoryType = '1';
      } else {
        this.FormData.categoryType = arr[0].categoryType;
      }
      this.fatherName = item.title;
      if (item.levelNum === '3') {
        this.multipledata = true;
        this.showRight = true;
        this.showCategory = true;
      } else if (item.levelNum === '4') {
        this.multipledata = true;
        this.showRight = false;
        this.showCategory = false;
      } else {
        this.multipledata = false;
        this.showRight = true;
        this.showCategory = true;
      }
    },
    // 懒加载数据
    loadData (item, callback) {
      let data = {
        parentUuid: item.uuid
      };
      ApiRequest(
        this.requestApi.getPlatCategorySubByParentUuid.url,
        this.requestApi.getPlatCategorySubByParentUuid.type,
        data,
        true
      ).then(res => {
        if (res.retStatus === '1') {
          let myNewData = [];
          if (res.retData !== null) {
            res.retData.forEach(item => {
              myNewData.push({
                title: item.categoryName,
                uuid: item.uuid,
                levelNum: item.levelNum,
                categoryType: item.categoryType,
                loading: false,
                children: []
              });
            });
            callback(myNewData);
          } else {
            callback(myNewData);
            this.$Message.info('该分类下无子分类');
          }
        }
      });
    }
  }
};
</script>
<style lang="less" scoped>
input::-webkit-outer-spin-button,
input::-webkit-inner-spin-button {
  -webkit-appearance: none !important;
  margin: 0;
}

input[type="number"] {
  -moz-appearance: textfield;
}
</style>
